@using Discussion.Core.Mvc
@using Discussion.Core.Utilities
@inject Discussion.Core.Models.SiteSettings SiteSettings
@model ChangePasswordViewModel
@{
    Layout = "_UserLayout.cshtml";
    ViewData["Title"] = "修改密码";

    var user = Context.DiscussionUser();
}



<h3>修改密码</h3>
<form asp-action="DoChangePassword" method="post" id="change-password-form">
    <div asp-validation-summary="All" class="text-danger"></div>
    <fieldset class="form-group">
        <label>
            用户名
        </label>
        <div>@user.UserName.ToPreferredUserName()</div>
    </fieldset>
    <fieldset class="form-group">
        <label asp-for="OldPassword">
            当前密码
        </label>
        <div>
            @Html.PasswordFor(model => model.OldPassword, new {autofocus = true, minlength = "6", maxlength = "20", @class = "form-control"})
        </div>
    </fieldset>
    <fieldset class="form-group">
        <label asp-for="NewPassword">
            新的密码
        </label>
        <div>
            @Html.PasswordFor(model => model.NewPassword, new {minlength = "6", maxlength = "20", @class = "form-control"})
        </div>
    </fieldset>
    <fieldset class="form-group">
        <label for="ConfirmPassword">
            再次确认
        </label>
        <div>
            <input type="password" id="ConfirmPassword" minlength="6" maxlength="20" class="form-control"/>
        </div>
    </fieldset>

    <button type="submit" class="btn btn-default">保存</button>
</form>


@section Tail{
    <script>
        (function() {
            var form = document.querySelector('#change-password-form');
            form.addEventListener('submit',
                function(e) {
                    var newPwd = $('#NewPassword').val();
                    var confirm = $('#ConfirmPassword').val();
                    
                    if (newPwd !== confirm) {
                        alert('请重复输入新的密码以确认');
                        $('#ConfirmPassword').focus();
                        e.preventDefault();
                        return false;
                    }
                });
        })();
    </script>
}